<template>
    <div class="authors-page">
        <div id="mescroll" class="mescroll" v-mescroll="{up:'upCallback',size:page.pageSize,num:page.pageNo}">
            <div class="mescroll-bounce">
                <div class="wrapper">
                    <div class="top">
                        <!--<i class="iconfont icon-fanhui" @click="back()"></i>-->
                        <z-history :type="1"></z-history>
                        <span>关注</span>
                    </div>
                    <div class="select-title">
                        <div class="author" :class="{'active':page.adminType*1===1}" @click="change(1)">作者</div>
                        <div class="publisher" :class="{'active':page.adminType*1===2}" @click="change(2)">主办方</div>
                    </div>
                    <div class="author-list" v-for="item in authorList">
                        <author-item :author='item' :autype="page.adminType" class="out-item"></author-item>
                    </div>
                </div>
            </div>
        </div>
        <!--<z-footer></z-footer>-->
    </div>
</template>

<script>
    import {appService} from '../../service/appService'
    import {authorService} from '../../service/authorService'
    import authorItem from '../../component/list/author.vue'

    export default {
        components: {'author-item': authorItem},
        // 添加以下代码
        metaInfo () {
            // console.log(this);
            const title = this.title
            return {
                title,
                meta: [
                    { vmid: 'description', name: 'description', content: '运联' },
                    { vmid: 'keyWords', name: 'keyWords', content: '运联首页' },
                ]
            }
        },
        data () {
            return {
                count: 1,title:'推荐关注',
            }
        },
        asyncData({store, route}) {
            store.state.homeStore.page = {pageNo: 1, pageSize: 10, adminType: 1}
            function getauthorList() {
                return authorService.authorList(store.state.homeStore.page).then(function (res) {
                    store.state.homeStore.authorList = res.data.datas.datas
                    store.state.homeStore.page.total = res.data.datas.totalPage
                    store.state.homeStore.page.pageNo = 2
                })
            }

            return Promise.all([
               getauthorList()
            ])

        },
        computed: {
            //将存在store中的数据取出
            authorList: {
                get: function () {
                    return this.$store.state.homeStore.authorList || []
                },
                set: function (newValue) {
                    return newValue
                }
            },
            page: {
                get: function () {
                    return this.$store.state.homeStore.page || []
                },
                set: function (newValue) {
                    return newValue
                }
            },
        },
        mounted: function () {
            let that = this
            // that.getauthorList()
//            that.getbanners()
            /*
             * 微信分享设置
             * */
            appService.getWxJssdk().then(function () {
                appService.getWxShare({hasGet:true},that.title)
            })
        },
        methods: {
            //搜索，带关键字跳转搜索页
            /*search:function (v) {
             let that = this
             that.$router.replace({name:'search',params:{type:1,query:v}})
             },*/
            //获取文章列表
            getauthorList: function () {
                let that = this
                let store = that.$store
                authorService.authorList(that.page).then(function (res) {
                    if (!res.data || !res.data.datas) return
                    let list = res.data.datas.datas
                    if (that.page.pageNo * 1 === 1) {
                        store.state.homeStore.authorList = res.data.datas.datas
                    } else {
                        for (let i in list) {
                            store.state.homeStore.authorList.push(list[i])
                        }
                    }
//                    that.articleList = that.$store.state.homeStore.articleList
                    that.page.pageNo += 1
                    that.mescroll.endSuccess(list.length);
                })
            },
            //上拉
            upCallback: function () {
                let that = this
                that.getauthorList()
            },
            //上拉
            change: function (v) {
                let that = this
                that.page.adminType = v
                that.page.pageNo = 1
                that.getauthorList()
            },
        },
        watch: {},
    }
</script>

<style lang="less">
    @import url("../../assets/css/mescroll.min.css");

    .authors-page .mescroll {
        .top{
            width: 100%;
            height: 1.1733rem;
            line-height: 1.1733rem;
            text-align: center;
            font-size: 0.48rem;
            color: #333;
            letter-spacing: 0.3px;
            background: #fff;
            border-bottom: 1px solid rgba(221, 221, 221, 0.5);
            z-index: 100;
            position:fixed;
        }
        bottom: 1.2rem !important;
        background:#f8f8f8;
        .out-item{
            padding-bottom:.4rem;
            border-bottom:1px solid #f0f0f0;
            background:#fff;
            .head-img{
                border-radius:0;
            }
        }
        .select-title{
            width:100%;
            display:flex;
            background:#fff;
            padding-top:1.2rem;
            .author,.publisher{
                flex:1;
                text-align:center;
                line-height:1.2rem;
                font-size: .426rem;
                color: #333333;
                box-shadow: inset 0 -1px 0 0 rgba(221,221,221,0.50);
            }
            .active{
                border-bottom:1px solid #20A0FF;
                color:#20A0FF;
            }
        }
    }

</style>
